﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>CheckBoxTree</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" />

    <script src="../../scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script src="../../scripts/miniui/miniui.js" type="text/javascript"></script><link href="../../scripts/miniui/themes/default/miniui.css" rel="stylesheet" type="text/css" />
    <link href="../../scripts/miniui/themes/icons.css" rel="stylesheet" type="text/css" />
    

</head>
<body>
    <h1>CheckBoxTree</h1>      

    <ul id="tree2" class="mini-tree" url="../data/tree.txt" style="width:300px;" 
        showTreeIcon="true" textField="text" idField="id" showCheckBox="true"
        onbeforenodecheck="onBeforeNodeCheck" checkRecursive="true" allowSelect="false" enableHotTrack="false"
        >        
    </ul>
    <div style="padding-top:5px;color:Red;">Note: checkRecursive决定是否联动选择节点</div>
    <br />
    <input type="button" value="setCheckedNodes" onclick="setCheckedNodes()"/>
    <input type="button" value="getCheckedNodes" onclick="getCheckedNodes()"/>

    <br />        
    <script type="text/javascript">
        
        function setCheckedNodes() {
            var tree = mini.get("tree2");
            tree.setValue("forms,button,lists");
        }
        function getCheckedNodes() {
            var tree = mini.get("tree2");
            var value = tree.getValue();
            alert(value);

        }
        //--------------------------------
        function onBeforeNodeCheck(e) {
            var tree = e.sender;
            var node = e.node;
            if (tree.hasChildren(node)) {
                //e.cancel = true;
            }
        }
       
    </script>

    <div class="description">
        <h3>Description</h3>
        <p>            
        </p>
    </div>
</body>
</html>